<template>
  <div class="dialog-container">
    <div class="dialog-content">
      <div class="upload-container">
        <FileUpload ref="FileUpload" @change="handleFileChange" />
      </div>
      <div class="line">
        <el-button @click="handleCancel"> 取消 </el-button>
        <el-button type="primary" @click="handleSubmit"> 确定 </el-button>
      </div>
    </div>
  </div>
</template>

<script>
import FileUpload from '@/components/audio/FileUpload.vue'

import { upyunUpload } from '@/utils/upyun'

export default {
  name: 'UPloadFile',
  components: { FileUpload },
  props: {
    color: {
      type: String,
      default: '#1890ff',
    },
    infoType: {
      type: String,
      default: 'asset',
    },
  },
  data() {
    return {
      fileList: [],
    }
  },
  methods: {
    handleCancel() {
      this.$emit('close')
    },
    handleSubmit() {
      if (this.fileList.find((item) => item.status === 'ready')) {
        this.$confirm('还有附件未上传完毕，是否确认添加？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
        }).then(() => {
          this.$emit('success', this.fileList)
        })
      } else {
        this.$emit('success', this.fileList)
      }
    },
    handleFileChange(files) {
      this.fileList = files
    },
  },
}
</script>
<style lang="scss" scoped>
.upload-container {
  height: 40vh;
  overflow: hidden;
  overflow-y: auto;
}
.line {
  margin-top: 20px;
  display: flex;
  justify-content: flex-end;
}
::v-deep .el-upload.el-upload--text {
  text-align: left;
}
</style>
